import * as React from "react";
import * as ReactDOM from "react-dom";

import "./Search.less";


export interface SearchProps {
    tips: string,
    onChange: Function,
    onConfrim?: Function
}

export interface State {
    value: string
}

export default class Search extends React.Component<SearchProps, State> {
    //默认属性
    static readonly defaultProps: SearchProps = {
        tips: '',
        onChange: null,
        onConfrim: () => {

        }
    };

    constructor(props: SearchProps) {
        super(props);
        //默认状态
        this.state = {
            value: ''
        };
    }

    //组件挂载后回调
    componentDidMount() {
        document.title = "";

    }

    render() {
        return <div className="Search">
            <input type="text" placeholder={this.props.tips}
                   onKeyDown={(event) => {
                       if (event.keyCode === 13) this.props.onConfrim(event.currentTarget.value)
                   }}
                   onChange={event => {
                       this.setState({value: event.currentTarget.value})
                   }}/>
            <i className="iconfont icon-sousuo" onClick={() => {
                this.props.onConfrim(this.state.value)
            }}/>
        </div>
    }
}
